<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>基本地图展示</title>
    <%String path = request.getContextPath(); %>
 
    <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
    <script src="http://cache.amap.com/lbs/static/es5.min.js"></script>
    <script src="http://webapi.amap.com/maps?v=1.3&key=a01e725e4f1ece39a6ee411de8e64c7d"></script>
  	<script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
  	<script type="text/javascript" src="<%=path%>/js/jquery.js"></script>
    <link href="<%=path%>/css/firstaid.css" rel="stylesheet" type="text/css"/>
  </head>
  
  <body>
     <div class="firstaid-toolbar-skin-black">
      <div class="s-sp-menu">
         <a href="<%=path%>/login/show.htm" target="_self">急救远程实况信息</a> 
         <a href="<%=path%>/car/carMap.htm" target="_self">地图及车辆位置信息</a>
      </div>
  </div>

  <div  class="Fnav">
     <span style="padding:0px; color:#888B92;font-size:20px;float:left;">当前救护车:</span>
     <dl id="mapcarid" style="margin: 0px;width=40px; align:left;float:left;"  class="firstaid-tool-bottom">
      
      <!--  <dd><img style='width="20px";padding-right:0px;vertical-align:middle;text-align:left;float:left;' src='<%=path%>/images/ccar.png'> </img><span   style='text-align:left;width:80;line-height:15px;position:absolute;float:left;color:#0C9A98;font-size:9px;'>carlicensplate<br><span style='float:left;color:#0C9A98;width:80;font-size:20px;font-weight:700;' >dis</span></span> </dd> -->
      <!--  <dd><img style="vertical-align:middle;" src="<%=path%>/images/ccar.png"></img></dd> -->
     </dl> 
  </div>

  <div   style="margin-top:109px;" id="container" ></div>
    <script type="text/javascript">
    	
	    
	    //相应的医院坐标
	    //哈尔滨坐标：126.694110,45.769690
	    //任丘坐标：116.0795161448,38.7093779990
       
      var map = new AMap.Map('container', {
               resizeEnable: true,
               zoom:11,
               zIndex:0,
               center: [126.694110,45.769690]
            });

       
       $(function() {

           carPosition();

           hospitalPosition();

      });

       window.setInterval(carPosition, 20000); 
       /*function showalert (argument) {
          alert("2321321");
       }*/

        /*设置医院中心点位置*/
       function  hospitalPosition() {
             var data = {"id":1,
                  "platform":"web",
                   "uid":"d4bdb016a3b94a3cb319e6d32ccdf4c3",
                   "parameter":{"or_id":"2"}};
            $.ajax({
                 url: '<%=path%>/organization/queryOrganizationInfo.htm',
                 type: 'POST',
                 dataType: 'json',
                 data: JSON.stringify(data),
                 contentType:"application/json",
            })
           .done(function(result) {
               var data = $.parseJSON(result);
               
                if (data.status=="100000") {
                  var longitude = data.result[0].longitude; //纬度，
                  var latitude  = data.result[0].latitude;  //经度
                  
              }
         })
         .fail(function() {
            console.log("网络不好，请重试。");
         });
              
       }
       

      
      /* 设置汽车位置  只有一辆车，车牌号写死*/
      function carPosition () {
        // alert("执行了我：");
         //获取车牌号的接口
          var data = {"id":1,
                   "platform":"web",
                   "uid":"d4bdb016a3b94a3cb319e6d32ccdf4c3",
                   "parameter":{"license_plate":"黑A96Q04"}}; 
         $.ajax({
           url: '<%=path%>/gps/queryGpsinfo.htm',
           type: 'POST',
           dataType: 'json',
           data: JSON.stringify(data),
           contentType:"application/json",
         })
         .done(function(result) {
          var data = $.parseJSON(result);
             if (data.status=="100000") {
                 var longitude = data.result.longitude; //纬度，
                 var latitude  = data.result.latitude;  //经度
                  var carId = data.result.license_plate;
                  /*alert("获取的车牌是："+carId);*/
                 //计算和医院的距离并做转化
                var lng=new AMap.LngLat(latitude,longitude);
                 //医院坐标
                 //哈尔滨坐标：126.694110,45.769690
                 //任丘坐标：116.0795161448, 38.7093779990
                 var lag=new AMap.LngLat(126.694110,45.769690);
                 var ss=lng.distance(lag);
                 var dis = "";
          /* dis = 89000; */
          /* ss = 128900; */
               if (ss<1000) {
                  dis = (ss).toFixed(1)+"米";
                 }else if(ss>1000){
                  dis = (Math.round(ss/100)/10).toFixed(1) + "公里";
              }

                 var  carHtml = "<dd><img style='width='20px';padding-right:0px;vertical-align:middle;text-align:left;float:left;' src='<%=path%>/images/ccar.png'> </img><span   style='text-align:left;width:80;line-height:15px;float:right;color:#0C9A98;font-size:9px;'>"+carId+"<br><span style='float:left;color:#0C9A98;width:80;font-size:20px;font-weight:500;' >"+dis+"</span></span> </dd>";
                 $("#mapcarid").empty();
                 $("#mapcarid").append(carHtml);
                    /* 更新坐标*/

                    //创建点标记 
                     var markers = new AMap.Marker({
                         icon: '<%=path%>/images/car_4.png',
                         /*map:map,*/
                          offset: new AMap.Pixel(-12.5,-12.5),
                         position:[latitude, longitude]
                      });
                 
                    
                   markers.setMap(map);
                   map.setZoomAndCenter(14,lng);
                  /*  map.setFitView();  */
             }
         })
         .fail(function() {
            console.log("网络不好，请重试。");
         });
         

         
      }
	    

    </script>
  </body>
</html>